<template>
  <div class="filter-comp">
    <label>
      <span>用户注册时间：</span>
      <el-date-picker v-model="value1" type="date" placeholder="Pick a day" size="default"
    /></label>
    <label>
      <span>关键词搜索：</span>
      <el-input v-model="input" style="width: 240px" placeholder="Please input"
    /></label>
    <el-button
      color="#03bf8a"
      :style="{ color: 'white', height: (30 / 19.2) * pxToRem + 'px' }"
      type="primary"
      >搜索</el-button
    >
  </div>
</template>
<script setup lang="ts">
import { pxToRem } from '@/utils/rem'
import { ref } from 'vue'
const value1 = ref('')
const input = ref('')
</script>
<style lang="scss">
.filter-comp {
  @include flex($ai: center);
  font-weight: 100;
  font-size: 16px;
  label {
    margin-right: 30px;

    span {
      margin-right: 10px;
    }
  }

  label:last-of-type {
    margin-right: 10px;
  }
}
</style>
